<extend name="Public/base"/>

<block name="style">
	<link rel="stylesheet" type="text/css" href="__STATIC__/plugins/jquery-nestable/jquery.nestable.css" />
</block>

<block name="body">

    <div class="row">
        <div class="col-md-12">
            
            <div class="tabbable tabbable-custom boxless">
                <form id="form" action="{:U('updateHook')}" method="post" class="form-1">
                <div class="tab-content">
                    
                    <div class="portlet box red">
                        <div class="portlet-title">
                            <div class="caption"><i class="fa fa-reorder"></i><present name="data">编辑<else />新增</present>钩子</div>
                            <div class="tools">
                                <a href="javascript:;" class="collapse"></a>
                                <a href="#portlet-config" data-toggle="modal" class="config"></a>
                                <a href="javascript:;" class="reload"></a>
                                <a href="javascript:;" class="remove"></a>
                            </div>
                        </div>
                        <div class="portlet-body form">
                            <!-- BEGIN FORM-->
                            
                                <div class="form-body">
                                    <div class="form-group">
                                        <label>钩子名称<span class="check-tips">（需要在程序中先添加钩子，否则无效）</span></label>
                                        <input type="text" class="form-control input-xlarge" name="name" value="{$data.name}">
                                    </div>
                                    <div class="form-group">
                                        <label>钩子描述<span class="check-tips">（钩子的描述信息）</span></label>
                                        <textarea class="form-control input-xlarge" rows="3"  name="description" >{$data.description}</textarea>
                                    </div>
      
                                    <div class="form-group">
                                        <label>钩子类型<span class="check-tips">（区分钩子的主要用途）</span></label>
                                        <select class="form-control  input-medium" name="type">
                                            <volist name=":C('HOOKS_TYPE')" id="vo">
                                                <option value="{$key}" <eq name="data.type" value="$key"> selected</eq>>{$vo}</option>
                                            </volist>
                                        </select>
                                    </div> 
                                     <present name="data">
                                        <div class="form-item cf">
                                            <label class="item-label">钩子挂载的插件排序<span class="check-tips">（拖动后保存顺序，影响同一个钩子挂载的插件执行先后顺序）</span></label>
                                            <div class="controls">
                                                <input type="hidden" name="addons" value="{$data.addons}" readonly>
                                                <empty name="data.addons">
                                                    暂无插件，无法排序
                                                <else />
                                                <div class="row">
                                                    <div class="col-md-3">
                                                        <div class="portlet box red">
                                                            <div class="portlet-title">
                                                                <div class="caption"><i class="fa fa-comments"></i>插件排序</div>
                                                            </div>
                                                            <div class="portlet-body ">
                                                            
                                                                <div class="dd" id="nestable_list_manage">
                                                                    <ol class="dd-list">
                                                                    <volist name=":explode(',',$data['addons'])" id="addons_vo">
                                                                        <li class="dd-item" data-id="{$addons_vo}">
                                                                            <div class="dd-handle">{$addons_vo}</div>
                                                                        </li>
                                                                    </volist>
                                                                    </ol>
                                                                </div>
                                                                
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                </empty>
                                            </div>
                                        </div>
                                    </present>

                                </div>
                                
                                
                                <div class="form-actions fluid ">
                                    <div class="col-md-offset-3 col-md-9">
                                        <input type="hidden" name="id" value="{$data.id}">
                                        <button type="submit" class="btn green submit-btn ajax-post" target-form="form-1">确 定</button>
                                        <button class="btn btn-return" onclick="javascript:history.back(-1);return false;">返 回</button>               
                                    </div>
                                </div>
                            
                            <!-- END FORM--> 
                        </div>
                    </div>
                    
                </div>
                
                </form>
            </div>
        </div>
    </div>
</block>

<block name="script">
	<!-- BEGIN PAGE LEVEL SCRIPTS -->
	<script src="__STATIC__/scripts/app.js"></script>
	<script src="__STATIC__/plugins/jquery-nestable/jquery.nestable.js"></script>  
	<!-- END PAGE LEVEL SCRIPTS -->
	<script>
	jQuery(document).ready(function() {       
		// initiate layout and plugins
		App.init();
        
        //导航高亮
        highlight_subnav('{:U('Addons/hooks')}');
		
		$('#nestable_list_manage')
		.nestable()
		.on({
			'selectstart':function(){
				return false;
			},
			'change':function(e){
				var list = e.length ? e : $(e.target),
					data = list.nestable('serialise'),
					val = [];
					
				for( p in data ){
					val.push(p);
				}
				$("input[name='addons']").val(val.join(','));
			}
		});
		
	});
	</script>
</block>